<template>
    <div>
        <button @click="showLoading">切换</button>
    </div>
</template>

<script setup lang="ts">
// 使用vue 插件功能 做一个 Loading组件

import { ComponentInternalInstance, getCurrentInstance } from 'vue'

const { appContext } = getCurrentInstance() as ComponentInternalInstance    // 解构当前实例

const showLoading = () => {
    console.log(appContext);
    appContext.config.globalProperties.$loading.show()               // 在OptionsApi中可以使用this 调用 this.$loading.show()
    setTimeout(() => {
        appContext.config.globalProperties.$loading.hide()
    }, 5000)
}
</script>

<style scoped>

</style>